<template>
  <div>
    <PanelSplitTwo bottomToolbarHeight="0" :num="2">
    <template #top>
      <SetUserSelect
        class="queryForm"
        :formData="orderSelect"
        v-model:queryParams="paginationParams"
        @selectFunc="selectFunc"
      ></SetUserSelect>
    </template>
     <template #centerToolbar>
      <div class="vex_flex">
        <VxeTableGrid
          style="flex: 1;"
          :tableColumn="tableColumn"
          :tableLoading="tableLoading"
          :dataList="dataList"
          :showPagination="true"
          :paginationParams="paginationParams"
          @getList="setQueryParams"
          @selectedChange="selectedChange"
        >
        </VxeTableGrid>
      </div>
     </template>
   </PanelSplitTwo>
   <el-dialog v-model="dialogFormVisible" title="新增">
        <SetUserSelect
          ref="setUserSelect"
          :key="keys"
          :formData="addorderSelect"
          v-model:queryParams="addpaginationParams"
          :isShowUserBtn="false"
          :buttonIsShow="false"
        ></SetUserSelect>
        <template #footer>
          <span class="dialog-footer">
            <el-button v-if="types != 1" @click="dialogFormVisible = false">取消</el-button>
            <el-button type="primary" @click="dialogFormVisibleFun"
              >确定</el-button
            >
          </span>
        </template>
      </el-dialog>
  </div>

</template>

<script setup lang="jsx">
import { useRouter } from 'vue-router'
import { finIntegralList as initData, finIntegralwrite } from "@/api/integral";
import datas from './data.js'
const { tableColumn, paginationParams, orderSelect }  = datas
const { proxy } = getCurrentInstance();
const router= useRouter ()
const dialogFormVisible = ref(false)
const onlineList = ref([]);
const loading = ref(false);
const total = ref(0);
const pageNum = ref(1);
const pageSize = ref(10);
let tableLoading = ref(false)
const dataList = ref([
])
// dataList.value = [{
//   fag: ''
// }]
const queryParams = ref({
  
});
tableColumn.value[4].slots = {
  default: ({ row }) => {
    return [
      <span
        style="cursor: pointer;color: #409EFF;"
        onClick={() => outListDelFun(row)}
      >
        查看明细
      </span>,
      <span
        style="cursor: pointer; margin-left: 20px;color: #409EFF"
        onClick={() => writeOffFun(row)}
      >
        核销
      </span>
    ]
  }
}
tableColumn.value[2].slots = {
  default: ({ row }) => {
    return row.type == 0? '代表' : '代理商'
  }
}
tableColumn.value[1].slots = {
  default: ({ row }) => {
    let text = ''
    if (row.type == 0) {
      orderSelect[1].selectData.length > 0 && orderSelect[1].selectData.forEach((val) => {
        if (val.id == row.id) {
          text = val.name
        }
      })
    } else {
      orderSelect[0].selectData.length > 0 && orderSelect[0].selectData.forEach((val) => {
        if (val.id == row.id) {
          text = val.name
        }
      })
    }
    return text
    // return row.type == 0? '代表' : '代理商'
  }
}
function outListDelFun(params) {
  router.push({
    path: '/integral/integralDetail',
    query: {
      id: params.type == 0? params.id : params.agencyId,
      type: params.type,
    }
  })
}
// 切换分页
  function setQueryParams(val) {
    paginationParams.value.pageNum = val.pageNum;
    paginationParams.value.pageSize = val.pageSize;
    getList();
  }
  // 选择表格
  function selectedChange(val) {
    // this.form.customerId = val.currentItem.customerId;
  }
/** 查询登录日志列表 */
function getList() {
  loading.value = true;
  initData(paginationParams.value).then(response => {
    dataList.value = response.rows;
    paginationParams.value.total = response.total;
    loading.value = false;
    tableLoading.value = false
  });
}
/** 搜索按钮操作 */
function handleQuery() {
  pageNum.value = 1;
  router.push({
    path: '/integral/integralDetail'
  })
}
/** 重置按钮操作 */
function resetQuery() {
  proxy.resetForm("queryRef");
  handleQuery();
}
/** 强退按钮操作 */
// function handleForceLogout(row) {
//     proxy.$modal.confirm('是否确认强退名称为"' + row.userName + '"的用户?').then(function () {
//   return forceLogout(row.tokenId);
//   }).then(() => {
//     getList();
//     proxy.$modal.msgSuccess("删除成功");
//   }).catch(() => {});
// }
tableLoading.value = true
setTimeout(() => {
  getList();
}, 500);

const selectFunc = () => {
  paginationParams.value.pageNum = 1
  getList()
}
let items = ref({})
const dialogFormVisibleFun = () => {
  proxy.$refs.setUserSelect.submitForm().then((val) => {
    // console.log('fasdf234', val)
    // console.log(items.value)
    let str = {}
    if (items.value.type == 1) {
      str.agencyId = items.value.agencyId
    } else {
      str.mrId = items.value.id
    }
    finIntegralwrite({
      ...str,
      integralType: 1,
      ...val,
      changeIntegral: -val.changeIntegral
    }).then(() => {
      proxy.$modal.msgSuccess(`核销成功`);
      dialogFormVisible.value = false
      getList()
    })
  })
}

const addorderSelect = ref([{
    label: '流水号',
    model: 'flowNumber',
    message: '请输入流水号',
    required: true,
    placeholder: '请输入',
    type: 'input',
    span: 24
  },
  {
    label: '金额',
    model: 'changeIntegral',
    message: '请输入金额',
    required: true,
    disabled: false,
    placeholder: '请输入',
    type: 'number',
    span: 24,
    max: 0,
  },
])
const keys = ref(0)
const addpaginationParams = ref({})
const writeOffFun = (item) => {
  dialogFormVisible.value = true
  addpaginationParams.value.changeIntegral = undefined
  if (!item.integral || item.integral == 0) {
    addorderSelect.value[1].disabled = true
  } else {
    addorderSelect.value[1].disabled = false
    addorderSelect.value[1].max = item.integral
  }
  keys.value = new Date().getTime()
  items.value = item

}
</script>
<style scoped>
  .app-container {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 85px);
    overflow: hidden;
  }
  .vex_flex {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    height: 100%;
    padding-top: 20px;
    box-sizing: border-box;
  }
  .flexmin {
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }
</style>